<ng-template #modal let-hide="close">
  <div class="modal-header">
    <h4 i18n class="modal-title">My settings</h4>
    <button class="border-0 p-0" title="Close this modal" i18n-title (click)="hide()">
      <my-global-icon iconName="cross"></my-global-icon>
    </button>
  </div>

  <div class="modal-body">
    <div i18n class="alert pt-alert-primary">These settings apply only to your session on this instance.</div>

    <h5 i18n class="mt-4 mb-2">Videos</h5>

    <my-user-video-settings
      *ngIf="!isUserLoggedIn()"
      [user]="user" [userInformationLoaded]="userInformationLoaded" [reactiveUpdate]="true" [notifyOnUpdate]="true"
    >
    </my-user-video-settings>

    <h5 i18n class="mt-4 mb-2">Interface</h5>

    <my-user-interface-settings
      *ngIf="!isUserLoggedIn()"
      [user]="user" [userInformationLoaded]="userInformationLoaded" [reactiveUpdate]="true" [notifyOnUpdate]="true"
    ></my-user-interface-settings>
  </div>
</ng-template>
